<style lang="scss" scoped>
  .listItem{
  	padding: 1.2rem 1rem;
  	border: 1px solid #0F91BE;
  	position: relative;
	margin-bottom: 2rem;
	background-color: rgba($color: #00a6ff, $alpha: 0.1);
  	.line1{
  		position: absolute;
  		width: 18px;
  		height: 2px;
  		background-color: #55ffff;
  	}
  	.line2{
  		position: absolute;
  		width: 2px;
  		height: 4px;
  		background-color: #55ffff;
  	}
  	.top_left{
  		left: 0;
  		top: 0;
  	}
  	.top_right{
  		right: 0;
  		top: 0;
  	}
  	.bottom_left{
  		left: 0;
  		bottom: 0;
  	}
  	.bottom_right{
  		right: 0;
  		bottom: 0;
  	}
  }
</style>
<template>
  <div class="listItem">
  	<slot></slot>
  	<div class="top_left line1"></div>
  	<div class="top_right line1"></div>
  	<div class="bottom_right line1"></div>
  	<div class="bottom_left line1"></div>
  	<div class="top_left line2"></div>
  	<div class="top_right line2"></div>
  	<div class="bottom_right line2"></div>
  	<div class="bottom_left line2"></div>
  </div>
</template>
<script>
export default {
  components: {
  },
  props: {
    item: {
      type:Object,
      default(){
      	return {}
      }
    },
  },
  data() {
    return {
      value: '',
	  fontSize:localStorage.getItem('fontSize') || 1
    };
  },
  mounted() {
    // const navbarHeight = this.$refs.navbar.offsetHeight
    // console.log('navbarHeight',navbarHeight)
    // this.$store.commit('setNavbarHeight',navbarHeight)
  },
  methods: {
    toDetailView(record) {
      // this.$emit('toDetailView',record)
	  this.$router.push('/index/detail')
    },
    onClickRight() {
      this.$router.push('/workbench')
    },
  },
};
</script>
